import 'package:flukit/flukit.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'ListPage.dart';

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with TickerProviderStateMixin {

  late TabController _controller;

  List<String> _titles = ["爆款电玩", "精品推荐"];

  @override
  void initState() {
    super.initState();

    _controller = TabController(
      length: _titles.length,
      initialIndex: 0,
      vsync: this,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          _topWidget(),
          Expanded(
              child: TabBarView(
                  controller: _controller,
                  children: [ListPage(0), ListPage(1)]))
        ],
      ),
    );
  }

  Widget _topWidget() {
    return SizedBox(
      width: Get.width,
      height: Get.width * 0.7 + MediaQuery.of(Get.context!).padding.top,
      child: Stack(
        children: [
          Container(
            decoration: BoxDecoration(
                borderRadius: BorderRadius.only(
                    bottomLeft: Radius.circular(Get.width * 0.2),
                    bottomRight: Radius.circular(Get.width * 0.2)),
                gradient: const LinearGradient(
                    colors: [Color(0xFFFF8343), Color(0xFFFF6C72)])),
          ),
          Column(
            children: [
              SizedBox(
                height: MediaQuery.of(Get.context!).padding.top + 10,
              ),
              Container(
                height: 50,
                padding: const EdgeInsets.symmetric(horizontal: 30),
                decoration: BoxDecoration(
                    color: Colors.white70,
                    borderRadius: BorderRadius.circular(10),
                    boxShadow: [
                      BoxShadow(color: Colors.grey.shade400, blurRadius: 10)
                    ]),
                child: TabBar(
                    controller: _controller,
                    isScrollable: true,
                    indicatorColor: const Color(0xFFFF8343),
                    indicatorSize: TabBarIndicatorSize.label,
                    tabs: _titles
                        .map((e) => Text(
                      e,
                      style: const TextStyle(color: Colors.black),
                    ))
                        .toList()),
              ),
              const SizedBox(
                height: 10,
              ),
              Expanded(
                child: Swiper(
                  viewportFraction: 0.8,
                  children: List.generate(
                      3,
                          (index) => Container(
                        margin: const EdgeInsets.symmetric(horizontal: 5),
                        decoration: BoxDecoration(
                          border: Border.all(color: Colors.white70),
                          borderRadius: BorderRadius.circular(15),
                        ),
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(15),
                          child: Image.asset(
                            "images/tops/top${index + 1}.jpg",
                            fit: BoxFit.cover,
                          ),
                        ),
                      )).toList(),
                ),
              ),
              const SizedBox(
                height: 10,
              ),
            ],
          ),
        ],
      ),
    );
  }
}
